<template>
 <div class="lateral-sliding">
    
    <div class="lateral-sliding-item" v-for="(item,index) in items" :key="index">
      
        <router-link to="/video">
          <div class="each-video">视频</div>
       
        
        </router-link>
        <router-link to="/preview">
           <div class="each-img" >
             图片
          </div>
        </router-link>
      
    </div>
  </div>

</template>
<script>
export default {
  data(){
    return {
       items: 10
    }
  }
}
</script>
<style scoped>
.lateral-sliding {
  display: flex;
  overflow-y: hidden;
  overflow-x: auto;
  margin: 0 60px;
    white-space: nowrap;
}
/* .lateral-sliding::-webkit-scrollbar {
        display:none
      } */
.lateral-sliding-item {
 flex: 1;
  margin-right: 20px;
  background-color: yellow;
  margin-bottom: 10px
}
.each-img {
  width: 340px;
  height: 300px;
  background-color: skyblue;
}
 .each-video{
    width: 340px;
  height: 300px;
  background-color: aliceblue;
 }
</style>

